import { Ref } from 'vue'
import { ElLink } from 'element-plus'
import { TableColumn } from '@/components/Table'
import { useI18n } from '@/hooks/web/useI18n'

export const useInvoiceTableColumns = (
  handleLink: Function,
  useEnumeratePicker: Function,
  applicantList: Ref<any[]>,
  statusList: Ref<any[]>,
  invoiceTypeList: Ref<any[]>,
  dataList: Ref<any[]>
): TableColumn[] => {
  const { t } = useI18n()

  return [
    {
      field: 'id',
      label: t('invoice.id'),
      minWidth: 70,
      align: 'center',
      headerAlign: 'center'
    },
    {
      field: 'invoice_no',
      label: t('invoice.invoice_no'),
      minWidth: 180,
      align: 'center',
      headerAlign: 'center',
      showOverflowTooltip: true,
      slots: {
        default: ({ row }) => (
          <ElLink underline={false} type="primary" onClick={() => handleLink('detail', row)}>
            {row.invoice_no}
          </ElLink>
        )
      }
    },
    {
      field: 'applicant',
      label: t('invoice.applicant'),
      minWidth: 180,
      align: 'center',
      headerAlign: 'center',
      showOverflowTooltip: true,
      slots: {
        default: ({ row }) => useEnumeratePicker(applicantList.value, row.applicant)
      }
    },
    {
      field: 'customer_id',
      label: t('invoice.customer_id'),
      minWidth: 180,
      align: 'center',
      headerAlign: 'center',
      showOverflowTooltip: true,
      slots: {
        default: ({ row }) => (
          <ElLink underline={false} type="primary">
            {row.customer_option?.label}
          </ElLink>
        )
      }
    },
    // {
    //   field: 'order_type',
    //   label: t('invoice.order_type'),
    //   minWidth: 100,
    //   align: 'center',
    //   headerAlign: 'center',
    //   showOverflowTooltip: true
    // },
    {
      field: 'order_id',
      label: t('invoice.order_id'),
      minWidth: 260,
      align: 'center',
      headerAlign: 'center',
      showOverflowTooltip: true,
      slots: {
        default: ({ row }) => (
          <ElLink underline={false} type="primary">
            {Array.isArray(row.order_option)
              ? row.order_option.map((item) => item.label).join(',')
              : row.order_option?.label}
          </ElLink>
        )
      }
    },
    {
      field: 'invoicing_date',
      label: t('invoice.invoicing_date'),
      minWidth: 120,
      align: 'center',
      headerAlign: 'center',
      showOverflowTooltip: true
    },
    {
      field: 'tax_refund',
      label: t('invoice.tax_refund'),
      minWidth: 180,
      align: 'center',
      headerAlign: 'center',
      showOverflowTooltip: true,
      slots: {
        default: ({ row }) => (row.tax_refund == 0 ? '否' : '是')
      }
    },
    {
      field: 'taxrefund_amount',
      label: t('invoice.taxrefund_amount'),
      minWidth: 120,
      align: 'center',
      headerAlign: 'center',
      showOverflowTooltip: true
    },
    {
      field: 'invoice_amount',
      label: t('invoice.invoice_amount'),
      minWidth: 120,
      align: 'center',
      headerAlign: 'center',
      showOverflowTooltip: true
    },
    {
      field: 'payment_ids',
      label: t('invoice.payment_ids'),
      minWidth: 180,
      align: 'center',
      headerAlign: 'center',
      showOverflowTooltip: true,
      slots: {
        default: ({ row }) => (
          <>
            {Array.isArray(row.payment_option)
              ? row.payment_option.map((item: any) => (
                  <ElLink underline={false} type="primary" key={item.value}>
                    {item.value}
                  </ElLink>
                ))
              : null}
          </>
        )
      }
    },
    {
      field: 'invoice_type',
      label: t('invoice.invoice_type'),
      minWidth: 180,
      align: 'center',
      headerAlign: 'center',
      showOverflowTooltip: true,
      slots: {
        default: ({ row }) => useEnumeratePicker(invoiceTypeList.value, row.invoice_type)
      }
    },
    {
      field: 'status',
      label: t('invoice.status'),
      minWidth: 180,
      align: 'center',
      headerAlign: 'center',
      showOverflowTooltip: true,
      slots: {
        default: ({ row }) => useEnumeratePicker(statusList.value, row.status)
      }
    },
    {
      field: 'creator',
      label: t('invoice.creator'),
      minWidth: 180,
      align: 'center',
      headerAlign: 'center',
      showOverflowTooltip: true,
      slots: {
        default: ({ row }) => useEnumeratePicker(applicantList.value, row.creator)
      }
    },
    {
      field: 'create_time',
      label: t('invoice.create_time'),
      minWidth: 180,
      align: 'center',
      headerAlign: 'center',
      showOverflowTooltip: true
    },
    {
      field: 'update_time',
      label: t('invoice.update_time'),
      minWidth: 180,
      align: 'center',
      headerAlign: 'center',
      showOverflowTooltip: true
    }
  ]
}
